<template>
	<view>
		<u-navbar titleStyle="font-size:40rpx;color:#333" :placeholder='true'  title="收银台"  leftIconColor="#fff">
		</u-navbar>

		<view class="padding32">
			<view class="flexRowCenter">
				<view class="center">
					<view class="co9">
						待付款金额
					</view>
					<view class="mt24 mb24">
						<text style="font-size: 48rpx;">￥</text>
						<text style="font-size: 72rpx;">{{totalPrice}}</text>
					</view>
					<!-- <view class="co9">
						支付剩余时间
						<u-count-down :time="15*60*1000" format="mm:ss" autoStart millisecond>
						</u-count-down>
					</view> -->
				</view>
			</view>
			<view style="margin-top:100rpx">
				<u-radio-group @change="showreturnway=false" v-model="payType" placement='column' iconPlacement="right">
					<view class="flexJBC" v-for="item in payArray" :key="item.id"
						style="width: 100%;margin-bottom: 100rpx;">
						<view class="flex">
							<image :src="item.image" mode=""
								style="width: 48rpx;height: 48rpx;border-radius: 50%;margin-right: 16rpx;"></image>
							<view class="">
								{{item.name}}
							</view>
						</view>
						<u-radio activeColor="red" :name="item.id">
						</u-radio>
					</view>
				</u-radio-group>
			</view>
			<view class="lisBox  padding32 mt24" style="margin-top: 100rpx;">
				<u-button :loading='loading' class=" bgcred cof fontS32 " @click="pay" style='border-radius: 40rpx;'>
					确认支付
				</u-button>
			</view>

		</view>
		<Pass :show='show' @isShow='isShow' @finish='finish' />
	</view>
</template>

<script>
	import Pass from '@/componentes/payPassWord.vue'
	export default {
		data() {
			return {
				isCreate:false, //是否创建订单
				sn: '',
				show: false,
				loading: false,
				data: {}, //参数
				totalPrice: 0, //总价
				payType: 2, //支付方式
				payArray: [
					// {
					// 	id: 5,
					// 	name: '余额支付',
					// 	image: '/static/images/mine/Group 33273.png'
					// },
					// {
					// 	id: 1,
					// 	name: '易宝支付',
					// 	image: '/static/images/mine/yipay.png'
					// },
					{
						id: 2,
						name: '支付宝支付',
						image: '/static/images/mine/zhifubao.png'
					},
					// {
					// 	id: 3,
					// 	name: 'ApplePay',
					// 	image: '/static/images/mine/Group 33278.png'
					// },
					// {
					// 	id: 4,
					// 	name: '微信支付',
					// 	image: '/static/images/mine/weixin.png'
					// },
				]
			}
		},
		watch: {
			show() {
				if (!this.show) {
					this.loading = false;
				}
			}
		},
		methods: {
			isShow(val) {
				this.show = val
				let _this=this;
				if(val==false){
					uni.showModal({
						title: "",
						content:'确定要放弃支付吗？',
						cancelText: '放弃支付', // 取消按钮的文字   
						confirmText: '继续支付', // 确认按钮的文字   
						success: function(res) {
							if (res.confirm) {
								_this.show = true
							}else{
								_this.show = false
								// _this.$my.go('/pages/my/order/orderList?type=1')
								uni.reLaunch({
									url:'/pages/my/order/orderList?type=1'
								})
								console.log(1111) 
								// uni.navigateTo({
								// 	url:'/pages/my/wallet/index'
								// })
							}
						}
					})
				}
			},
			// 支付密码
			finish(password) {
				let data = {
					pay_pwd: password
				}
				this.surPay(data)
			},

			surPay(data) {
				let data1 = {
					pay_type: this.payType,
					money: this.totalPrice,
					sn: this.sn,
				}
				this.$my.post('/index/order/pay', Object.assign(data, data1, )).then(res => {
					this.loading = false
					this.show=false
					// 余额不足
					// this.$my.toast(res.message)
					if(res.code==206){
						uni.showModal({
							title: "",
							content:'余额不足，跳转去充值？',
							cancelText: '取消', // 取消按钮的文字   
							confirmText: '确认', // 确认按钮的文字   
							success: function(res) {
								if (res.confirm) {
									uni.navigateTo({
										url:'/pages/my/wallet/index'
									})
								}
							}
						})
						return
					}
					if (res.code == 200) {
						if (this.payType == 5) {
							// 余额支付
							this.$my.go('/myPackageA/goodsAndFacton/pay/paySuccessful')
						}else if(this.payType==2){
							// 支付宝支付
							console.log(res.data.prePayTn)
							this.win = plus.webview.create(res.data.prePayTn, "test", {additionalHttpHeaders: { Referer: "https://netsea.aucfan-cn.com" },});
							this.win.show();  
							setTimeout(()=>{ 
								uni.redirectTo({
									url:'/pages/my/order/orderList'
								})
							},5000)   
							// uni.requestPayment({
							//     provider: 'alipay',
							//     orderInfo: res.data.param, //微信、支付宝订单数据 【注意微信的订单信息，键值应该全部是小写，不能采用驼峰命名】
							//     success: function (res) {
							//         console.log('success:' + JSON.stringify(res));
							//     },
							//     fail: function (err) {
							//         console.log('fail:' + JSON.stringify(err));
							//     }
							// });
						} 
					}
				})
			},
			pay() { 
				// 1.先创建订单  2.支付
				console.log(this.data)
				this.loading = true;
				if (this.data.sn) {
					// 订单详情立即支付
					this.sn = this.data.sn
					
					if (this.payType == 5) {
						this.isShow(true)
					}else{
						this.surPay({})
					}
				} else {
					this.$my.post('/index/order/create', Object.assign(this.data, {
						pay_type: this.payType
					})).then(res => {
						if (res.code == 200) {
							this.isCreate=true;
							this.sn = res.data.sn
							// 余额支付需要输入密码
							if (this.payType == 5) {
								this.isShow(true)
								// 支付宝支付
							} else{
								this.surPay({})
							}
						} else {
							this.loading = false
							this.$my.toast(res.message)
						}
					})
				}

			}
		},
		onLoad(option) {
			this.totalPrice = option.totalPrice ? option.totalPrice : 0
			this.data = JSON.parse(option.data)
			console.log(this.data)
		},
		onShow() { 
			let pages = getCurrentPages()
	    	console.log(pages[0],pages[pages.length-1],pages[pages.length-2])
		},
		components: {
			Pass
		},
	}
</script>

<style>
	page {
		background-color: #fff;
	}
</style>
<style lang="scss" scoped>
	// /deep/ .u-radio-label--right{
	// 	width: 100%;
	// 	// padding: 26rpx 0;

	// 	box-sizing: border-box;
	// }
	// /deep/ .u-radio-group--row{
	// 	justify-content: space-between;
	// 	flex-wrap: wrap;
	// }
</style>
